<!DOCTYPE html>
<html lang="en">
<head>
	
	<!--
	Level 13
	
	A text-based science fiction adventure by Noora Routasuo.
	Based on the Ash.js engine and inspired by several incremental / idle games.
	
	See changelog.json for version information.
	-->
	
	<meta charset="utf-8" />
	<title>13层 - Level 13</title>
	<meta itemprop="description" name="description" property="og:description" content="A text-based science fiction adventure game.">
	<meta itemprop="image" property="og:image" content="favicon.png" />
	<meta itemprop="name" property="og:title" content="Level 13" />
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<link rel="shortcut icon" href="favicon.ico" />
	<link rel="image_src" href="favicon.png" />
	<link rel="stylesheet" type="text/css" href="css/normalize.css" />
	<link rel="stylesheet" type="text/css" href="css/gridism.css" />
	<link rel="stylesheet" type="text/css" href="css/main.css" />
	<link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32" />
	<link rel="icon" type="image/png" href="favicon-16x16.png" sizes="16x16" />
</head>

<body class="wrap wider dark" style="height:100%">
	<script src="zh/chs.js"></script>
	<script src="zh/core.js"></script>
	<div class="sticky-footer-wrapper game-opacity-controller">
		<div class="grid hidden-by-popups" id="grid-main">
			<div class="unit four-fifths" id="unit-main" style="display: none">
				
				<h1 class="hide-from-visual-layout">Header</h1>
				<div id="mobile-header" class="hidden-when-down" role="banner">
					<div id="mobile-header-tribe">
						<div id="statsbar-tribe-stats-mobile" class="statsbar-tribe-stats mobile-header-section"></div>
						<!--
						<span id="statsbar-hope-mobile" class="statsbar statsbar-hope">
							Deity: <span id="deity-name-mobile" class="deity-name">Name</span>
						</span>
						-->
					</div>
					<div id="mobile-header-self">
						<div class="player-stats-container mobile-header-section"></div>
						<!--
						<div id="container-equipment-stats-mobile" class="container-equipment-stats"></div>
						-->
					</div>
					<div id="mobile-header-status" class="mobile-header-section">
						<ul class="itemlist player-perks-list" id="player-perks-list-mobile"></ul>
						<ul class="itemlist player-statuses-list" id="player-statuses-list-mobile"></ul>
					</div>
					<div id="mobile-header-bag" class="mobile-header-section">
						<div id="header-bag-storage-mobile" class="header-bag-storage stat-indicator">
							<span class="label text-key" data-text-key="ui.inventory.storage_name_long"></span>
							<span class="value">0</span>
							/
							<span class="value-total">0</span>
						</div>
						<span id="header-bag-currency-mobile" class="header-bag-currency stat-indicator">
							<span class="label text-key" data-text-key="game.resources.currency_name"></span>
							<span class="value">0</span>
						</span>
						<div id="bag-resources-mobile" class="bag-resources statsbar"></div>
						<!--
						<ul class="itemlist list-header-items" id="list-header-items-mobile"></ul>
						-->
					</div>
					<!--
					<div id="mobile-header-explorers" class="mobile-header-section">
						<ul class="itemlist list-header-explorers" id="list-header-explorers-mobile"></ul>
					</div>
					-->
					<div id="mobile-header-camp" class="mobile-header-section">
						<div id="header-camp-storage-mobile" class="stat-indicator header-camp-storage">
							<span class="label"></span>
							<span class="value">0</span>
						</div>
						<div id="header-camp-reputation-mobile" class="stat-indicator header-camp-reputation">
							<span class="label text-key" data-text-key="ui.tribe.current_reputation_label"></span>
							<span class="value">0</span>
							<span id="reputation-change-indicator-mobile" class="change-indicator"></span>
						</div>
						<div id="header-camp-population-mobile" class="stat-indicator header-camp-population">
							<span class="label text-key" data-text-key="ui.camp.current_population_label"></span>
							<span class="value">0</span>
							<span id="population-change-indicator-mobile" class="change-indicator"></span>
						</div>
						<div id="header-camp-currency-mobile" class="stat-indicator header-camp-currency">
							<span class="label text-key" data-text-key="game.resources.currency_name"></span>
							<span class="value">0</span>
						</div>
					</div>
					<div id="mobile-header-camp-res" class="mobile-header-section">
						<div id="statsbar-resources-mobile" class="statsbar-resources"></div>
					</div>
					<div id="mobile-header-notification-container" class="mobile-header-section">
						<div id="notification-player-mobile" class="notification-player">
							<div id="notification-player-bar-mobile" class="progress-wrap progress notification-player-bar">
								<div class="progress-bar progress"></div>
								<span class="progress-label progress"></span>
							</div>
						</div>
					</div>
				</div>

				<div id="header-side" class="hidden-when-down" role="banner">
					<h3 class="hide-from-visual-layout">Status</h3>
					<div id="header-self-bar" class="lvl13-box-2">
						<ul class="itemlist player-perks-list" id="player-perks-list-regular"></ul>
						<ul class="itemlist player-statuses-list" id="player-statuses-list-regular"></ul>
						
						<div class="player-stats-container"></div>
						
						<hr/>
						<div id="container-equipment-stats-side" class="container-equipment-stats"></div>
					</div>
					
					<div id="notification-player-regular" class="unit whole notification-player">
						<div id="notification-player-bar-regular" class="progress-wrap progress notification-player-bar">
							<div class="progress-bar progress"></div>
							<span class="progress-label progress"></span>
						</div>
					</div>
				</div>
				
				<div class="grid" id="grid-main-header" class="vision-container hidden-when-down" role="banner">
					<h3 class="hide-from-visual-layout">Stats</h3>
					<div class="unit whole lvl13-box-1 header-row" id="header-tribe-container">
						<div id="statsbar-self" class="statsbar">
							<div id="statsbar-tribe-stats-regular" class="statsbar-tribe-stats"></div>
							<span id="statsbar-deity-regular" class="statsbar statsbar-deity">
								Deity: <span id="deity-name-regular" class="deity-name">Name</span>
							</span>
						</div>
					</div>
					
					<div class="unit whole lvl13-box-1 header-row" id="header-camp-container">
						<h3 class="hide-from-visual-layout">Inventory</h3>
						
						<div class="header-section" id="main-header-bag">
							<div id="header-bag-storage-regular" class="header-bag-storage stat-indicator">
								<span class="label text-key" data-text-key="ui.inventory.storage_name_long"></span>
								<span class="value">0</span>
								/
								<span class="value-total">0</span>
							</div>
							<div id="header-bag-currency-regular" class="header-bag-currency stat-indicator">
								<span class="label text-key" data-text-key="game.resources.currency_name"></span>
								<span class="value">0</span>
							</div>
							<div id="bag-resources-regular" class="bag-resources statsbar"></div>
							<ul class="itemlist list-header-items" id="list-header-items-regular"></ul>
						</div>
						
						<div class="header-section" id="main-header-items">
							<ul class="itemlist list-header-explorers" id="list-header-explorers-regular"></ul>
						</div>
							
						<div class="header-section" id="main-header-camp">
							<div class="header-section" id="main-header-camp-overview">
							<div id="header-camp-storage-regular" class="stat-indicator header-camp-storage">
								<span class="label">Storage</span>
								<span class="value">0</span>
							</div>
							<div id="header-camp-reputation-regular" class="stat-indicator header-camp-reputation">
								<span class="label text-key" data-text-key="ui.tribe.current_reputation_label"></span>
								<span class="value">0</span>
								<span id="reputation-change-indicator-regular" class="change-indicator"></span>
							</div>
							<div id="header-camp-population-regular" class="stat-indicator header-camp-population">
								<span class="label text-key" data-text-key="ui.camp.current_population_label"></span>
								<span class="value">0</span>
								<span id="population-change-indicator-regular" class="change-indicator"></span>
							</div>
							<div id="header-camp-currency-regular" class="stat-indicator header-camp-currency">
								<span class="label text-key" data-text-key="game.resources.currency_name"></span>
								<span class="value">0</span>
							</div>
							</div>
							<div class="header-section" id="main-header-camp-resources">
							<div id="statsbar-resources-regular" class="statsbar-resources">
							</div>
							</div>
						</div>
							
					</div>
				</div><!-- grid for the whole stats bar -->
				
				<div class="grid">
					<div id="grid-location-header" class="unit whole vision-container">
						<div class='info-callout-target info-callout-target-side'><img id="level-icon" /></div>
						<h1>Camp</h1>
					</div>
				</div>
				
				<div class="grid hidden-by-popups" id="grid-switch" role="navigation">
					<div id="switch" class="unit whole">
						<ul class="tabs" id="switch-tabs">
							<li id="switch-out" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_out_button_label"></span></li>
							<li id="switch-embark" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_embark_button_label"></span></li>
							<li id="switch-in" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_camp_button_label"></span></li>
							<li id="switch-bag" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_bag_button_label"></span></li>
							<li id="switch-explorers" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_explorers_button_label"></span></li>
							<li id="switch-map" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_map_button_label"></span></li>
							<li id="switch-trade" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_trade_button_label"></span></li>
							<li id="switch-projects" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_projects_button_label"></span></li>
							<li id="switch-upgrades" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_upgrades_button_label"></span></li>
							<li id="switch-world" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_tribe_button_label"></span></li>
							<li id="switch-milestones" tabindex="0"><span class="name vision-text text-key" data-text-key="ui.main.tab_milestones_button_label"></span></li>
						</ul>
					</div>
				</div><!-- grid for the switch -->
				
				<div class="grid grid-content hidden-by-popups vision-background" id="grid-switch-content" role="main">
				
					<div class="grid" id="grid-tab-header">
						<div class="unit whole" id="tab-header">
						<button id="btn-header-rename" class="context btn-meta tabelement tab-options text-key" data-tab="switch-in" data-text-key="ui.camp.rename_camp_button_label" style="display:none"></button>
						<div class="tabelement" data-tab="switch-map" style="display:none;">
							<select id="select-header-mapstyle" class="context tab-options"></select>
							<select id="select-header-mapmode" class="context tab-options"></select>
							<select id="select-header-level" class="context tab-options"></select>
							<button id="btn-download-map" class="btn-meta context tab-options">download</button>
						</div>
						<h2 class="noninteractive">&nbsp;</h2>
						</div>
					</div><!-- grid for the header" -->
			
					<!-- vis for camp -->
					<div class="grid tabcontainer" id="container-tab-vis-in" data-tab="switch-in">
						<div class="unit whole" id="tab-vis-in">
							<div id="tab-vis-in-container" class="vis-container canvas-container">
								<canvas id="campvis" width="800" height="10" role="img" aria-label="camp view"></canvas>
								<div id="vis-camp-layer-buildings" class="vis-camp-layer"></div>
								<div id="vis-camp-info-overlay"><span>Info here</span></div>
							</div>
						</div>
					</div>
					
					<!-- camp basic stuff: buildings & population -->
					<div class="grid tabcontainer" id="container-tab-two-in" data-tab="switch-in" style="display:none">
						<div class="unit golden-large">
							<h3 class="text-key" data-text-key="ui.camp.improvements_header">Buildings</h3>
							<div id="in-improvements" class="actionbox">
								<table>
								</table>
							</div>
						</div>
						<div class="unit unit golden-small">
							<div id="in-population" class="infobox">
								<h3>Population</h3>
								<div id="in-population-details" class="infobox" style='display:none'>
									<div id="in-population-status">
										<span id="in-population-status-free"></span>
										<div id="unassigned-workers-bubble" class="bubble">!</div>
										<span id="in-population-status-disabled" class="warning"></span>
									</div>
									<div id="in-population-autoassigned" class="info-callout-target" description="Roles that any unassigned workers will be assigned to (when you are not in this camp). If multiple selected, roles with fewest workers get assigned first.">Auto-assigned</div>
									<div class="info-callout-target">
										<div style="display: none" id="in-population-robots">Robots: <span class="stats-value-container"><span class="value">0</span><span id="robots-change-indicator" class="change-indicator"></span></span></div>
									</div>
								</div>
								<table class="full-width" id="in-assign-workers">
								</table>
								<p style="display:none" id="in-population-next"></p>
								<div id="in-population-bar-next" class="progress-wrap progress">
									<div class="progress-bar progress"></div>
									<span class="progress progress-label"></span>
								</div>
								<span style="display: none; font-size: 85%" id="in-population-reputation"></span>
								<span style="display: none; font-size: 85%" id="in-population-decrease-hint" class="warning"></span>
							</div>
							<div id ="in-characters" class="infobox">
								<h3 class="text-key" data-text-key="ui.camp.characters_subheader"></h3>
								<ul></ul>
							</div>
							<div id="in-occurrences" class="infobox">
								<h3 class="text-key" data-text-key="ui.camp.events_subheader"></h3>
								<div id="in-occurrences-building-container"></div>
								<div id="in-occurrences-camp-container"></div>
								<div id="in-occurrences-misc-container"></div>
								<div id="in-occurrences-outgoing-caravans-container"></div>
								<p class="p-meta text-key" id="in-occurrences-empty" data-text-key="ui.camp.events_none_description"></p>
							</div>
							<div id="in-demographics" class="infobox p-dense">
								<h3 class="text-key" data-text-key="ui.camp.details_subheader"></h3>
								<div id="in-demographics-general">
									<p id="in-demographics-general-age">Founded: <span class="value">-</span></p>
									<p id="in-demographics-general-luxuries">Luxury resources available: 
										<span class="value">-</span>
										<span class='info-icon info-callout-target info-callout-target-small'>
											<img src="img/eldorado/icon-detail-dark.png" class="img-themed" data-src-sunlit="img/eldorado/icon-detail.png" data-src-dark="img/eldorado/icon-detail-dark.png" />
										</span>
									</p>
								</div>
								<div id="in-demographics-raid">
									<div class='info-callout-target'>
										<p id="in-demographics-raid-danger">Danger from raids: <span class="value"></span></p>
									</div><br/>
									<div class='info-callout-target'>
										<p id="in-demographics-raid-defence">Camp defences: <span class="value"></span></p>
									</div>
									<p id="in-demographics-raid-last">Last event: <span class="value"></span></p>
								</div>
								<div id="in-demographics-disease">
									<div class='info-callout-target'>
										<p id="in-demographics-disease-chance">Disease outbreak chance: <span class="value"></span></p>
									</div><br/>
								</div>
								<div id="in-demographics-level">
									<p id="in-demographics-trade-network">Trade with other camps: <span class="value"></span></p>
									<p id="in-demographics-level-population">Level population density: <span class="value"></span></p>
									<p id="in-demographics-level-danger">Level raid danger: <span class="value"></span></p>
								</div>
								<p id="in-demographics-debug-general" class="debug-info"><span class="value"></span></p>
							</div>
						</div>
					</div>
					
					<!-- "embark" page when leaving camp -->
					<div class="grid tabcontainer" id="container-tab-enter-out" data-tab="switch-embark">
						<div class="unit whole">
							<p class="text-key" data-text-key="ui.embark.page_description"></p>
							<div class="grid">
								<div class="unit one-third" id="embark-resources-container">
									<div class="subheader"><h3 class="text-key" data-text-key="ui.embark.resources_subheader"></h3></div>
									<table id="embark-resources">
									</table>
								</div>
								<div class="unit two-thirds" id="embark-items-container">
									<div class="subheader"><h3 class="text-key" data-text-key="ui.embark.items_subheader"></h3></div>
									<table id="embark-items">
									</table>
								</div>
							</div>
							<p>
							<div class="stat-indicator" id="embark-bag">
								<span class="label text-key" data-text-key="ui.embark.selected_bag_amount_label"></span>
								<span class="value">0</span>
								/
								<span class="value-total">0</span>
							</div>
							</p>
							<div class="actionbox">
							<h3 class="hide-from-visual-layout">Embark</h3>
							<button class="action text-key" id="in-action-leave" action="leave_camp" data-text-key="ui.embark.leave_camp_button_label"></button>
							<span class="warning hidden-by-default" id="embark-warning"></span>
							</div>
						</div>
					</div>
					
					<!-- level: minimap and header -->
					<div class="grid tabcontainer" id="container-tab-two-out" data-tab="switch-out">
						<div class="unit unit-compass" id="out-container-compass">
							<div id="minimap-background-container" class="canvas-container">
								<canvas id="minimap-background" width="224" height="224"></canvas>
								<div id="minimap-container" class="canvas-container" style="width: 198px; height: 198px">
									<canvas id="minimap" width="198" height="198" role="img" aria-label="area map"></canvas>
								</div>
							</div>
							<div class="infobox">
								<span id="out-position-indicator" class="info-detail vision-text"></span>
								<span id="out-distance-indicator" class="info-detail vision-text"></span>
							</div>
						</div>
						<div class="unit unit-rest">
							<h2 id="header-sector">Sector header</h2>
							<div id="out-desc"></div>
						</div>
					</div>
					
					<div class="grid tabcontainer" id="container-tab-two-out-actions" data-tab="switch-out" style="display:none;">
						<div class="unit unit-compass" id="out-container-compass-actions">
							<h3 class="text-key" data-text-key="ui.exploration.move_header"></h3>
							<table id="table-out-actions-movement">
							</table>
							<div id="out-actions-movement" class="actionbox">
							<button class="action action-location text-key" data-tab="switch-out" id="out-action-enter" action="enter_camp" data-text-key="game.actions.enter_camp_name">Enter camp</button>
							<button class="action btn-icon text-key" data-tab="switch-out" id="out-action-move-up" action="move_level_up" data-text-key="game.actions.move_level_up_name"><span>Move up</span></button>
							<button class="action btn-icon text-key" data-tab="switch-out" id="out-action-move-down" action="move_level_down" data-text-key="game.actions.move_level_down_name"><span>Move down</span></button>
							<button class="action btn-icon text-key" data-tab="switch-out" id="out-action-move-camp" action="move_camp_level" data-text-key="game.actions.move_camp_level_name"><span>Back to camp</span></button>
							<p id="out-action-move-camp-details" class="p-meta button-detail-label">(2 blocks)</p>
							</div>
						</div>
						
						<div class="unit unit-rest">
							<div class="subheader" id="header-out-actions">
								<h3 class="text-key" data-text-key="ui.exploration.scavenge_actions_header"></h3>
							</div>
							<div id="out-actions" class="actionbox">
								<button class="action action-location tabbutton" data-tab="switch-out" id="out-action-sca" action="scavenge">Scavenge</button>
								<button class="action action-location" id="out-action-scout" action="scout">Scout</button>
								<button class="action action-location" id="out-action-investigate" action="investigate">Investigate</button>
								<button class="action action-location" id="out-action-examine" action="examine">Examine</button>
								<button class="action action-location btn-x-wide" id="out-action-scavenge-heap" action="scavenge_heap">Scavenge heap</button>
								<button class="action action-location" id="out-action-clear-workshop" action="clear_workshop">Scout workshop</button>
								<button class="action action-location" id="out-action-use-spring" action="use_spring">Refill water</button>
								<button class="action action-location" id="out-action-get-up" action="get_up"><span>Get up</span></button>
								<button class="action action-location btn-icon" id="out-action-nap" action="nap"><span>Rest</span></button>
								<button class="action action-location" id="out-action-wait" action="wait"><span>Wait</span></button>
								<button class="action action-location" id="out-action-despair" action="despair">Despair</button>
								<span id="container-out-actions-movement-related">
								</span>
							</div>

							<div class="subheader" id="header-out-characters">
								<h3 class="text-key" data-text-key="ui.exploration.characters_header"></h3>
							</div>
							<div id="out-characters" class="actionbox">
								
							</div>
							
							<div class="subheader" id="header-out-improvements">
								<h3 class="text-key" data-text-key="ui.exploration.build_actions_header"></h3>
							</div>
							<div id="out-improvements" class="actionbox">
								<table>
								<tr id="out-improvements-collector-water">
									<td><button class="action action-build action-location text-key" action="build_out_collector_water" id="out-action-build-bucket" data-text-key="game.improvements.collector_water_name_default"></button></td>
									<td><button class='action action-improve btn-glyph-big' id="out-action-improve-bucket" action="improve_out_collector_water">▲</button></td>
									<td><button class="action action-use action-location btn-narrow text-key" action="use_out_collector_water" id="out-action-use-bucket" data-text-key="ui.exploration.collect_all_resources_label"></button></td>
									<td><button class="action action-use action-location btn-compact" action="use_out_collector_water_one" id="out-action-use-bucket_one">1</button></td>
									<td class="list-storage vision-text"></td>
								</tr><tr id="out-improvements-collector-food">
									<td><button class="action action-build action-location text-key" action="build_out_collector_food" id="out-action-build-trap" data-text-key="game.improvements.collector_food_name_default"></button></td>
									<td><button class='action action-improve btn-glyph-big' id="out-action-improve-trap" action="improve_out_collector_food">▲</button></td>
									<td><button class="action action-use action-location btn-narrow text-key" action="use_out_collector_food" id="out-action-use-trap" data-text-key="ui.exploration.collect_all_resources_label"></button></td>
									<td><button class="action action-use action-location btn-compact" action="use_out_collector_food_one" id="out-action-use-trap_one">1</button></td>
									<td class="list-storage vision-text"></td>
								</tr><tr id="out-improvements-beacon">
									<td><button class="action action-build action-location" action="build_out_beacon" id="out-action-build-beacon">Beacon</button></td>
									<td><button class='action action-dismantle btn-glyph-big' id="out-action-dismantle-beacon" action='dismantle_out_beacon'>×</button></td>
								</tr><tr id="out-improvements-camp">
									<td><button class="action action-build action-location" action="build_out_camp" >Camp</button></td>
								</tr>
								</table>
							</div>
							<div class="actionbox" id="out-locales">
								<div class="subheader">
									<h3 class="text-key" data-text-key="ui.exploration.locales_header"></h3>
								</div>
								<table id="table-out-actions-locales">
								</table>
							</div>
						</div>
					</div>
					
					<!-- bag main div: item list & crafting -->
					<div class="grid tabcontainer" id="container-tab-two-bag" data-tab="switch-bag" style="display:none">
						<div class="unit three-quarters">
							<div class="subheader" id="header-bag-equipment">
								<h3 class="text-key" data-text-key="ui.inventory.equipment_header"></h3>
							</div>
							<div class="infobox" id="container-equipment-slots">
								<div id="item-slot-bag" class="item-slot item-slot-big lvl13-box-1"></div>
								<div id="item-slot-light" class="item-slot item-slot-big lvl13-box-1"></div>
								<div id="item-slot-weapon" class="item-slot item-slot-big lvl13-box-1"></div>
								<div id="item-slot-clothing_over" class="item-slot item-slot-big lvl13-box-1"></div>
								<div id="item-slot-clothing_upper" class="item-slot item-slot-big lvl13-box-1"></div>
								<div id="item-slot-clothing_lower" class="item-slot item-slot-big lvl13-box-1"></div>
								<div id="item-slot-clothing_head" class="item-slot item-slot-big lvl13-box-1"></div>
								<div id="item-slot-clothing_hands" class="item-slot item-slot-big lvl13-box-1"></div>
								<div id="item-slot-shoes" class="item-slot item-slot-big lvl13-box-1"></div>
							</div>
							<div class="select-container" id="bag-autoequip-container">
								<span class="label">Equip best:</span>
								<select id="select-bag-autoequip-type"></select>
								<button id="btn-bag-autoequip" class="action btn-mini" action="auto_equip">Equip</button>
							</div>
							<div class="subheader" id="header-bag-items">
								<h3 class="text-key" data-text-key="ui.inventory.other_items_header">Other items</h3>
							</div>
							<div class="infobox">
								<ul id="bag-items" style="padding:0px; margin: 0px"></ul>
								<p id="bag-items-empty" class="p-meta">Nothing here</p>
							</div>
						</div>
						<div class="unit one-quarter">
							<div id="self-bag-actions" class="actionbox">
								<button id="btn-self-manage-inventory">Manage inventory</button>
							</div>
							<div class="subheader" id="header-self-use-items">
								<h3 class="text-key" data-text-key="ui.inventory.use_item_header"></h3>
							</div>
							<div id="self-use-items" class="actionbox">
								<ul class="buttonlist">
								</ul>
							</div>
							<div class="subheader" id="header-self-repair-items">
								<h3 class="text-key" data-text-key="ui.inventory.repair_item_header"></h3>
							</div>
							<div id="self-repair-items" class="actionbox">
								<table>
								</table>
							</div>
							<div class="subheader">
								<h3 class="text-key" data-text-key="ui.inventory.craft_item_header"></h3>
							</div>
							<input type="checkbox" class="checkbox" id="checkbox-crafting-show-obsolete" /><p class="checkbox-label" id="label-crafting-show-obsolete">Show obsolete</p>
							<div id="self-craft" class="actionbox">
							</div>
						</div>
					</div>
					
					<div class="grid tabcontainer" id="container-tab-two-explorers" data-tab="switch-explorers" style="display:none;">
						<div class="unit whole">							
							<div id="tab-explorers-section-selected" class="unit-section">
								<div class="subheader" id="header-party"><h3>Exploration party</h3></div>
								<div class="infobox" id="container-party-slots">
								</div>
							</div>
							
							<div id="tab-explorers-section-unselected" class="unit-section">
								<div class="subheader" id="header-explorers"><h3>Other explorers</h3></div>
								<div class="infobox">
									<ul id="list-explorers" class="itemlist"></ul>
									<p id="explorers-empty" class="p-meta">Nothing here.</p>
								</div>
							</div>
							
							<div id="tab-explorers-section-recruits" class="unit-section">
								<div class="subheader" id="header-recruits"><h3>Recruits</h3></div>
								<p id="recruits-empty-message">No recruits here at the moment.</p>
								<div id="recruits-container" class="actionbox">
									<table></table>
								</div>
							</div>
						</div>
					</div>
					
					<div class="grid tabcontainer" id="container-tab-two-map" data-tab="switch-map" style="display:none">
						<div class="unit whole">
							<p id="map-completion-hint">There are still places to explore on this level.</p>
							<div id="mainmap-container-container" class="tabelement" data-tab="switch-map">
								<div id="mainmap-container" class="canvas-container lvl13-box-1">
									<canvas id="mainmap" width="500" height="500" role="img" aria-label="level map"></canvas>
									<div id="mainmap-overlay" class="canvas-overlay"></div>
								</div>
							</div>
							<div id="mainmap-container-ascii">
								<textarea rows="12" readonly></textarea>
								<div id="mainmap-ascii-legend" class="lvl13-box-1"></div>
							</div>
							<div id="mainmap-sector-details" class="lvl13-box-1" style="margin: 5px; padding: 5px;">
								<button id="btn-mainmap-sector-details-next" aria-label="Next sector" class="context btn-glyph">
									<img src="img/eldorado/icon-next-dark.png" class="img-themed" data-src-sunlit="img/eldorado/icon-next.png" />
								</button>
								<button id="btn-mainmap-sector-details-previous" aria-label="Previous sector" class="context btn-glyph">
									<img src="img/eldorado/icon-previous-dark.png" class="img-themed" data-src-sunlit="img/eldorado/icon-previous.png" />
								</button>
								<button id="btn-mainmap-sector-details-camp" aria-label="Camp sector" class="context btn-glyph">
									<img src="img/map/map-camp-sunlit.png" class="img-themed" data-src-sunlit="img/map/map-camp.png" />
								</button>
								<button id="btn-mainmap-sector-details-unknown" aria-label="Unvisited sectors" class="context btn-glyph">
									<img src="img/map/map-unvisited-sunlit.png" class="img-themed" data-src-sunlit="img/map/map-unvisited.png" />
								</button>
								<button id="btn-mainmap-sector-details-unscouted" aria-label="Unscouted sectors" class="context btn-glyph">
									<img src="img/map/map-interest-sunlit.png" class="img-themed" data-src-sunlit="img/map/map-interest.png" />
								</button>
								<button id="btn-mainmap-sector-details-investigate" aria-label="Sectors which can be investigated" class="context btn-glyph">
									<img src="img/map/map-investigate-sunlit.png" class="img-themed" data-src-sunlit="img/map/map-investigate.png" />
								</button>
								<button id="btn-mainmap-sector-details-ingredients" aria-label="Sectors with ingredients" class="context btn-glyph">
									<img src="img/map/map-ingredient-sunlit.png" class="img-themed" data-src-sunlit="img/map/map-ingredient.png" />
								</button>
								<div id="mainmap-sector-details-content-empty">
									<h3 class="text-key" data-text-key="ui.map.sector_details_header"></h3>
									<p class="meta text-key" id="mainmap-sector-details-empty-text-canvas" data-text-key="ui.map.sector_details_empty_info_canvas"></p>
									<p class="meta text-key" id="mainmap-sector-details-empty-text-ascii" data-text-key="ui.map.sector_details_empty_info_ascii"></p>
								</div>
								<div id="mainmap-sector-details-content">
									<h3><span id="mainmap-sector-details-name">Sector</span> <span id="mainmap-sector-details-pos"/></h3>
									<table class="spacious full-width">
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_district_label"></td><td><span id="mainmap-sector-details-district"></span></td></tr>
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_distance_label"></td><td><span id="mainmap-sector-details-distance"></span> <button id="btn-mainmap-sector-path" class="btn-meta">(directions)</button></td></tr>
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_poi_label"></td><td><span id="mainmap-sector-details-poi"></span></td></tr>
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_scavenging_label"></td><td><span id="mainmap-sector-details-res-sca"></span></td></tr>
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_collectors_label"></td><td><span id="mainmap-sector-details-res-col"></span></td></tr>
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_threats_label"></td><td><span id="mainmap-sector-details-threats"></span></td></tr>
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_blockers_label"></td><td><span id="mainmap-sector-details-blockers"></span></td></tr>
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_environment_label"></td><td><span id="mainmap-sector-details-env"></span></td></tr>
										<tr><td class="textwidth text-key" data-text-key="ui.map.sector_detail_other_label"></td><td><span id="mainmap-sector-details-misc"></span></td></tr>
									</table>
								</div>
								<div id="mainmap-sector-details-content-debug">
									<button id="btn-cheat-teleport" class="meta">Teleport</button>
									<span id="mainmap-sector-debug-text"></span>
								</div>
							</div>
						</div>
					</div>
					
					<div class="grid tabcontainer" id="container-tab-trade" data-tab="switch-trade" style="display:none">
						<div class="unit whole">
							<div class="subheader"><h3>Incoming caravans</h3></div>
							<p id="trade-caravans-incoming-empty-message">No traders here at the moment.</p>
							<div id="trade-caravans-incoming-container" class="actionbox">
								<table class="fullwidth"></table>
							</div>

							<div class="subheader"><h3>Outoing caravans</h3></div>
							<p id="trade-caravans-outgoing-empty-message">No outgoing caravans at the moment.</p>
							<ul id="trade-caravans-outgoing-list"></ul>

							<div class="subheader"><h3>Trade partners</h3></div>
							<p id="trade-caravans-partners-empty-message">No trade partners discovered yet.</p>
							<div id="trade-caravans-outgoing-container" class="actionbox">
								<table></table>
							</div>
							<p id="trade-caravans-outgoing-num">Available caravans:</p>
						</div>
					</div>
					
					<div class="grid tabcontainer" id="container-tab-two-projects" data-tab="switch-projects" style="display:none">
						<div class="unit whole">
							<div class="actionbox" id="container-in-improvements-colony">
								<div class="subheader"><h3>Colony projects</h3></div>
								<div id="in-improvements-colony" class="actionbox">
									<table class="fullwidth"></table>
								</div>
								<p id="in-improvements-colony-empty-message" class="text-key" data-text-key="ui.projects.no_available_colony_projects_description"></p>
								<div class="subheader" id="header-in-improvements-colony-built"><h3>Built colony projects</h3></div>
								<div id="in-improvements-colony-built" class="actionbox">
									<table class="fullwidth"></table>
								</div>
								<button id="in-action-launch" class="action" action="launch">Launch</button>
							</div>
							<div class="infobox">
								<div class="subheader"><h3 id="header-in-improvements-level" class="text-key" data-text-key="ui.projects.available_projects_header"></h3></div>
								<div id="in-improvements-level" class="actionbox">
									<table class="fullwidth"></table>
								</div>
								<p id="in-improvements-level-empty-message" class="text-key" data-text-key="ui.projects.no_available_projects_description"></p>
							</div>
							<div id="container-in-improvements-level-hidden">
								<button id="in-improvements-reset-hidden" class='btn-meta btn-meta-float'>reset</button>
								<div class="subheader"><h3 id="header-in-improvements-level-hidden" class="text-key" data-text-key="ui.projects.hidden_projects_header"></h3></div>
								<p id="in-improvements-hidden-message">There are no building projects available.</p>
							</div>
							<div class="subheader"><h3 id="header-in-improvements-level-built" class="text-key" data-text-key="ui.projects.built_projects_header"></h3></div>
							<div id="in-improvements-level-built" class="actionbox">
								<table class="fullwidth"></table>
							</div>
						</div>
					</div>
					
					<div class="grid tabcontainer" id="container-tab-two-upgrades" data-tab="switch-upgrades" style="display: none;">
						<div class="unit whole">
							<div id="world-blueprints" class="actionbox">
								<div class="subheader"><h3 class="text-key" data-text-key="ui.upgrades.blueprints_header"></h3></div>
								<table id="blueprints-list" class="fullwidth">
								</table>
							</div>
							<div id="world-upgrades" class="actionbox">
								<div class="subheader"><h3 class="text-key" data-text-key="ui.upgrades.available_upgrades_header"></h3></div>
								<table id="upgrades-list" class="fullwidth spacious">
								</table>
								<p id="world-upgrades-empty-message">No available upgrades at the moment.</p>
							</div>
							<div id="world-upgrades-info" class="infobox">
								<div class="subheader"><h3 class="text-key" data-text-key="ui.upgrades.all_upgrades_header"></h3></div>
								<p id="world-upgrades-count">Completed upgrades: 0</p>
								<div class ="infobox">
								<div id="researched-upgrades-vis-container" class="canvas-container lvl13-box-1">
									<canvas id="researched-upgrades-vis" width="100" height="100" role="img" aria-label="technology tree"></canvas>
									<div id="upgrades-vis-overlay" class="canvas-overlay"></div>
								</div>
								<div id="upgrade-details" class="lvl13-box-1" style="margin: 5px; padding: 5px;">
									<div id="upgrade-details-content-empty">
										<h4 class="text-key" data-text-key="ui.upgrades.upgrade_details_header">Upgrade details</h4>
										<p class="meta text-key" data-text-key="ui.upgrades.upgrade_details_none_selected_hint"></p>
									</div>
									<div id="upgrade-details-content">
									<span id="upgrade-details-status" class="status-badge">Status</span>
										<h4 id="upgrade-details-name">Upgrade name</h4>
										<p>
											<span id="upgrade-details-desc">Upgrade description</span><br/>
											<span id="upgrade-details-effect" class="p-meta"></span><br/>
											<span id="upgrade-details-unlocked-research" class="p-meta"></span>
										</p>
									</div>
								</div>
								</div>
							</div>
						</div>
					</div>
			
					<div class="grid tabcontainer" id="container-tab-two-world" data-tab="switch-world" style="display:none">
						<div class="unit whole">
							<div class="infobox">
								<div class="subheader"><h3 class="text-key" data-text-key="ui.tribe.messages_header"></h3></div>
								<p id="world-message"></p>
								<div class="subheader"><h3 class="text-key" data-text-key="ui.tribe.overview_header"></h3></div>
								<table id="camp-overview" class="full-width dense">
									<tr id="camp-overview-header" class="lvl13-box-1 header-mini hide-in-small-layout">
										<th class="th-text" colspan="2">camp</th>
										<th class="th-number" colspan="2">pop</th>
										<th class="th-number hide-in-small-layout">rep</th>
										<th class="th-number hide-in-small-layout">raid</th>
										<th class="th-number hide-in-small-layout">disease</th>
										<th class="th-number hide-in-small-layout">storage</th>
										<th class="th-text" colspan="2">production</th>
										<th class="th-number"></th>
										<th class="th-number"></th>
									</tr>
								</table>
							</div>
						</div>
					</div>
					
					<div class="grid tabcontainer" id="container-tab-two-milestones" data-tab="switch-milestones" style="display:none">
						<div class="unit whole">
							<div class="milestone-container" id="milestone-container-current">
								<h3>Current: <span id='milestone-current-name' class="hl-functionality"></span></h3>
								<p id="milestone-current-description"></p>
								<div id="milestone-current-unlocks"></div>
							</div>
							<div class="milestone-container" id="milestone-container-next">
								<h3>Next: <span id='milestone-next-name' class="hl-functionality"></span></h3>
								<p id="milestone-next-description"></p>
								<div id="milestone-next-unlocks"></div>
								<div id="milestone-population-bar" class="progress-wrap progress full-width">
									<div class="progress-bar progress"></div>
									<span class="progress progress-label"></span>
								</div>
								<div class="columns-container">
									<div id="milestone-next-reqs" class="columns-child infobox">
									</div>
									<div id="milestone-next-button-container" class="columns-child columns-child-small"></div>
								</div>
							</div>
						</div>
					</div>
					
			</div><!-- main switch content grid -->
			
			</div><!-- excluding log -->
			
			<div id="log-container" class="unit one-fifth div-horizontal-space-filler hidden-by-popups">
				<h1 class="hide-from-visual-layout hide-while-loading" id="header-log-main">Log</h2>
				<h2 class="hide-from-visual-layout hide-while-loading" id="header-log-latest">Latest</h3>
				<div id="log-latest" class="hide-from-visual-layout">
					<ul role="log"></ul>
				</div>
				<h2 class="hide-from-visual-layout hide-while-loading" id="header-log-all">All</h3>
				<div id="log" class="limit-height">
					<ul></ul>
				</div>
			</div>
			
		</div><!-- main grid -->
	
		<div class="grid sticky-footer-push"></div>
		
	</div><!-- sticky footer wrap -->
	
	<div class="grid sticky-footer hidden-by-popups">
		<div class="unit unit four-fifths" id="footer">
			<span id="game-version" class="p-meta"></span>
			<span id="game-msg" class="p-meta"></span>
			<ul id="game-options-extended" style="display:none">
				<li><button class="btn-meta text-key" data-text-key="ui.meta.settings_button_label" id="btn-settings"></button></li>
				<li><button class="btn-meta text-key" data-text-key="ui.meta.game_info_button_label" id="btn-info"></button></li>
				<li><button class="btn-meta text-key" data-text-key="ui.meta.player_stats_button_label" id="btn-stats"></button></li>
				<li><button class="btn-meta text-key" data-text-key="ui.meta.game_data_button_label" id="btn-importexport"></button></li>
				<li><span>:</span></li>
			</ul>
			<ul id="game-options">
				<li><button class="btn-meta text-key" data-text-key="ui.meta.more_options_button_label" id="btn-more"></button>
				<li><button class="btn-meta text-key" data-text-key="ui.meta.restart_button_label" id="btn-restart"></button></li>
				<li><button class="btn-meta text-key" data-text-key="ui.meta.quick_save_button_label" id="btn-save"></button></li>
			</ul>
		</div>
	</div><!-- sticky footer -->
	
	<!-- popups -->

	<div id="popup-overlay" style="display: none;" aria-hidden="false">
	
		<div id="fight-popup" role="dialog" class="popup fill-on-mobiles hidden-by-default popup-ingame" style="display:none" aria-labelledby="fight-title" aria-modal="true">
			<h3 id="fight-title"></h3>
			<p id="fight-desc"></p>
			<div class="infobox" id="fight-popup-enemy-info">
				<div class="container-relative">
					<p id="fight-popup-enemy-name" class="nomargin">Enemy name & strength</p>
					<div id="fight-damage-indictor-enemy" class="fight-damage-indicator">-5</div>
					<div id="fight-status-indictor-enemy" class="fight-status-indicator">dodge</div>
				</div>
				<p id="fight-popup-enemy-stats" class="nomargin">Enemy strength</p>
				<p id="fight-popup-enemy-difficulty" class="nomargin">Enemy difficulty</p>
			</div>
			<div id="fight-popup-bars">
				<div class="progress-multibar-container progress centered">
					<div id="fight-bar-enemy" class="progress-wrap progress">
						<div class="progress-bar progress"></div>
						<div class="progress-bar-change progress"></div>
					</div>
					<div id="fight-bar-enemy-shield" class="progress-wrap progress-wrap-science progress">
						<div class="progress-bar progress"></div>
						<div class="progress-bar-change progress"></div>
					</div>
				</div>
				<div class="progress-multibar-container progress centered">
					<div id="fight-bar-self" class="progress-wrap progress">
						<div class="progress-bar progress"></div>
						<div class="progress-bar-change progress"></div>
					</div>
					<div id="fight-bar-self-shield" class="progress-wrap progress-wrap-science progress">
						<div class="progress-bar progress"></div>
						<div class="progress-bar-change progress"></div>
					</div>
				</div>
			</div>
			<div class="infobox" id="fight-popup-self-info">
				<div class="container-relative">
					<p id="fight-popup-self-name" class="nomargin">Player name</p>
					<div id="fight-damage-indictor-self" class="fight-damage-indicator">-5</div>
					<div id="fight-status-indictor-self" class="fight-status-indicator">dodge</div>
				</div>
				<p id="fight-popup-self-stats" class="nomargin">Player strength</p>
				<span id="fight-popup-self-equipment"></span>
			</div>
			<div class="container-nomargin" id="fight-popup-items">
				<ul class="itemlist" id="list-fight-items" style="margin-top: -10px;"></ul>
				<span id="fight-popup-itemlist-separator">|</span>
				<ul class="itemlist" id="list-fight-explorers" style="margin-top: -10px;"></ul>
			</div>
			<div class="buttonbox" id="fight-buttons-infightactions"></div>
			<div id="fight-popup-results"></div>
			<div class="buttonbox" id="fight-buttons-main">
				<button id="out-action-fight-cancel" class="action action-manual-trigger" action="flee">Flee</button>
				<button id="out-action-fight-confirm" class="action" action="fight">Fight</button>
				<button id="out-action-fight-close">Leave</button>
				<button id="out-action-fight-continue">Continue</button>
				<button id="out-action-fight-takeselected" class="action inventory-selection-ok" action="accept_inventory">Continue</button>
				<button id="out-action-fight-takeall" class='action inventory-selection-takeall' action='take_all'>Take all</button>
			</div>
		</div>
		
		<div id="incoming-caravan-popup" role="dialog" class="popup popup-wide fill-on-mobiles hidden-by-default popup-ingame" style="display:none" aria-labelledby="trade-header" aria-modal="true">
			<h3 id="trade-header">Trader</h3>
			<p id="incoming-caravan-popup-markup"></p>
			<div class="inventorybox" style="display:flex">
				<div id="inventorylist-incoming-caravan-camp-inventory" class="inventorydivision" style="width: 170px">
					<p class="inventorybox-header">Camp inventory</p>
					<ul></ul>
					<p class="msg-empty">(empty)</p>
				</div>
				<div id="inventorylist-incoming-caravan-camp-offer" class="inventorydivision inventorydivision-with-footer highlightbox" style="width: 130px">
					<p class="inventorybox-header">Camp offer</p>
					<ul></ul>
					<p class="msg-empty">(empty)</p>
					<p class="value inventorybox-footer">0</span>
				</div>
				<div id="inventorylist-incoming-caravan-trader-offer" class="inventorydivision inventorydivision-with-footer highlightbox" style="width: 130px">
					<p class="inventorybox-header">Trader offer</p>
					<ul></ul>
					<p class="msg-empty">(empty)</p>
					<p class="value inventorybox-footer">0</span>
				</div>
				<div id="inventorylist-incoming-caravan-trader-inventory" class="inventorydivision" style="width: 170px">
					<p class="inventorybox-header">Trader inventory</p>
					<ul></ul>
					<p class="msg-empty">(empty)</p>
				</div>
			</div>
			<div id="incoming-caravan-popup-multiplier"></div>
			<div class="buttonbox" id="incoming-caravan-buttons-main">
				<button id="incoming-caravan-popup-cancel">Cancel</button>
				<button id="incoming-caravan-popup-reset">Reset</button>
				<button id="incoming-caravan-popup-confirm" class="action" action="trade_with_caravan">Trade</button>
			</div>
		</div>
		
		<div id="manage-save-popup" role="dialog" class="popup fill-on-mobiles hidden-by-default popup-ingame" style="display:none" aria-labelledby="manage-save-popup-header" aria-modal="true">
			<h3 id="manage-save-popup-header">Manage saves</h3>
			<p id="manage-save-info">Note that the game is still in alpha and updates can break old saves.</p>

			<div class="columns-container" id="save-list-container">
				<div id="save-list" class="columns-child">
				</div>
				<div id="save-list-options" class="columns-child columns-child-small">
					<div id="save-list-options-empty">
						<p id="save-list-options-empty-text" class="dimmed">Select a save slot from the list</p>
					</div>
					<div id="save-list-options-selected">
						<p id="save-list-options-info">Info</p>
						<button id="btn-save-list-options-save">Save</button>
						<button id="btn-save-list-options-load">Load</button>
						<button id="btn-save-list-options-export">Export</button>
					</div>
					<div id="save-list-options-export">
						<p>Export</p>
						<textarea id="textarea-export-save" rows="5"></textarea>
						<p id="save-export-info" class="debug-info"></p>
						<button id="btn-copy-export">Copy</button>
						<button id="btn-download-export">Download</button>
						<button id="btn-back-from-export">Back</button>
					</div>
				</div>
			</div>

			<div id="save-import-container">
				<textarea id="textarea-import-save" rows="5" cols="60"></textarea>
				<div>
				<p id="import-save-msg"></p>
				<button id="paste-import">Paste</button>
				<button id="load-import">Load</button>
				</div>
			</div>

			<div class="buttonbox">
				<button id="open-import">Import</button>
				<button id="open-save-list">Back to list</button>
				<button id="close-manage-save-popup" class="button-popup-default">Close</button>
			</div>
		</div>

		<div id="game-stats-popup" role="dialog" class="popup fill-on-mobiles hidden-by-default popup-ingame" style="display: none" aria-labelledby="game-stats-popup-header" aria-modal="true">
			<h3 id="game-stats-popup-header">Game Stats</h3>
			<div id="game-stats-container" class="scrollable-container"></div>
			<div class="buttonbox">
				<button id="game-stats-popup-close" class="button-popup-default">Close</button>
			</div>
		</div>

		<div id="settings-popup" role="dialog" class="popup fill-on-mobiles hidden-by-default popup-ingame" style="display: none" aria-labelledby="settings-popup-header" aria-modal="true">
			<h3 id="settings-popup-header">Settings</h3>
			<span class="settings-entry">
				<input type="checkbox" class="checkbox" id="settings-checkbox-sfx-enabled" /><p class="checkbox-label">Enable sounds</p>
			</span>
			<span class="settings-entry">
				<input type="checkbox" class="checkbox" id="settings-checkbox-hotkeys-enabled" /><p class="checkbox-label">Enable hotkeys</p>
			</span>
			<span class="settings-entry">
				<input type="checkbox" class="checkbox" id="settings-checkbox-hotkeys-numpad" /><p class="checkbox-label">Use Numpad for movement</p>
			</span>
			<div id="hotkeys-list" class="scrollable-container"></div>
			<div id="language-selection" class="hidden-by-default">
				<select id="language-dropdown"></select>
			</div>
			<div class="buttonbox">
				<button id="settings-popup-close" class="button-popup-default">Close</button>
			</div>
		</div>

		<div id="dialogue-popup" role="dialog" class="popup fill-on-mobiles hidden-by-default popup-ingame" style="display: none" aria-labelledby="dialogue-popup-header" aria-modal="true">
			<h2 id="dialogue-popup-header" class="hide-from-visual-layout">Dialogue</h2>

			<div class="dialogue-module" id="dialogue-module-title"><h3></h3></div>
			
			<div class="dialogue-module" id="dialogue-module-character"></div>

			<div class="dialogue-module" id="dialogue-module-dialogue"><p></p></div>

			<div class="dialogue-module" id="dialogue-module-meta"><p class="p-meta"></p></div>
			
			<div class="dialogue-module" id="dialogue-module-results"></div>

			<div class="buttonbox"></div>
		</div>
		
		<div id="common-popup" role="dialog" class="popup fill-on-mobiles hidden-by-default popup-ingame" style="display:none" aria-labelledby="common-popup-header" aria-modal="true">
			<h3 id="common-popup-header"></h3>
			<p id="common-popup-desc"></p>
			<p id="common-popup-input-container"><input class="text" autocomplete="false" autofocus="true"/></p>
			<div id="info-results"></div>
			<div class="buttonbox"></div>
		</div>

	</div>
	
	<!-- whole page overlays -->

	<div id="mobile-overlay" style="display:none">
		<p>Level 13 isn't optimized for mobile. The layout works best on larger screens and many elements rely on hover effects. For the best experience, please come back on a different device.</p>
		<p>If you want to try it out anyway, <a href="#" id="btn-dismiss-mobile-overlay">click here</a> to dismiss this message.</p>
	</div>
	
	<div class="thinking-content">
		<div class="loading-spinner">
			<div class="loading-dot loading-dot1"></div>
			<div class="loading-dot loading-dot2"></div>
			<div class="loading-dot loading-dot3"></div>
		</div>
	</div>
	
	<div class="loading-content">
		<p class="hide-from-visual-layout">Loading</p>
		<div class="loading-spinner">
			<div class="loading-dot loading-dot1"></div>
			<div class="loading-dot loading-dot2"></div>
			<div class="loading-dot loading-dot3"></div>
		</div>
	</div>
	
	<div id="theme-transition-overlay" style="display:none"></div>

	<div id="audio-container">
		<audio id="audio-action-started"><source src="audio/UIClick_BLEEOOP_Baby_Click.wav" type="audio/mpeg"></audio>
		<audio id="audio-action-completed"><source src="audio/MECHSwtch_BLEEOOP_Mechanism.wav" type="audio/mpeg"></audio>
		<audio id="audio-button-clicked"><source src="audio/UIClick_BLEEOOP_Baby_Click.wav" type="audio/mpeg"></audio>
		<audio id="audio-moved"><source src="audio/footstep1.mp3" type="audio/mpeg"></audio>
		<audio id="audio-moved-camp"><source src="audio/footstep2.mp3" type="audio/mpeg"></audio>
		<audio id="audio-notification"><source src="audio/Modern10.ogg" type="audio/mpeg"></audio>
		<audio id="audio-popup-opened"><source src="audio/UIClick_BLEEOOP_Well_Oiled.wav" type="audio/mpeg"></audio>
		<audio id="audio-popup-closed"><source src="audio/UIClick_BLEEOOP_Old_Keycap.wav" type="audio/mpeg"></audio>
	</div>

	<!-- GoatCounter (visitor counter) -->
	 <script>
		window.goatcounter = {
			path: (location.hostname || "unknown") + "" + (location.pathname || "/"),
		}
	</script>
	<script data-goatcounter="https://level13.goatcounter.com/count" async src="//gc.zgo.at/count.js"></script>

	<!-- GlitchTip (exception tracker) -->
	 <script src="https://browser.sentry-cdn.com/7.60.0/bundle.min.js" crossorigin="anonymous"></script>

	<!-- RequireJS -->
	<script data-main="src/config" src="lib/requirejs/require.min.js"></script>
<!--客服 开始-->
<script src="//g8hh.github.io/static/js/jquery.min.js"></script>
<link rel="stylesheet" href="//g8hh.github.io/static/css/kf.css" type="text/css" media="screen" charset="utf-8">
<script src="//g8hh.github.io/static/js/kf.js"></script>
<!-- 客服 结束 -->
<!--站长统计-->
   <div style="display: none"><script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?f237591d5976f87ca2e06b38c3658d9c";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>

    </div>
</body>
</html>
